<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <title>投放广告</title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="/static/admin/css/bootstrap.min.css?v=3.3.6">
    <link rel="stylesheet" href="/static/admin/css/bootstrap-select.min.css" >
    <link rel="stylesheet" href="/static/admin/css/bootstrap-datetimepicker.min.css" >

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="/static/admin/js/jquery.min.js"></script>

    <script src="/static/admin/js/bootstrap-select.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="/static/admin/js/bootstrap.min.js"></script>

    <script src="/static/admin/js/bootstrap-datetimepicker.min.js"></script>
    <script src="/static/admin/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
    <script src="/static/admin/js/jquery.form.min.js"></script>
    <style>
        .lesspadding {
            padding-left: 0px;
        }
        .font_blue {
            color: aqua;
        }
    </style>
</head>
<body>
<div class="container-fluid">
    <br><br>
    <div class="row" >
        <div class="col-xs-5"><img src="http://{$Think.server.http_host}/upload/{$account.logo}" width="100%"></div>
        <div class="col-xs-7 lesspadding">
            <span class="pull-right font_blue" style="font-size: 12px; padding-right: 10px">{$account.classified} {$account.area}</span>
            <p style="font-size: 30px"><strong>{$account.name}</strong></p>
            <h4>微信号：{$account.wechat_id}</h4>
            <h6 class="text-muted">微信认证：<br>{$account.info}</h6>
            <p><a href="{:url('detail')}?wid={$Think.get.wid}" class="btn btn-primary">查看详情</a></p>
        </div>
    </div>
    <hr>
    <ul class="list-group">
    </ul>
    <div class="text-center">
        <a data-toggle="modal" data-target="#myModal" onclick="checkPeople()"><span class="glyphicon glyphicon-plus btn-lg"></span></a>
        <h6 class="text-muted">建议您至少提前七天派单，否则流、拒单率较高</h6>
    </div>

</div>

<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">创建订单</h4>
            </div>
            <div class="modal-body">
                <form id="uploadForm" action="{:url('order')}" enctype="multipart/form-data" method="post">
                    <input type="hidden" name="account" value="{$account.name}">
                    <input type="hidden" name="people_id" value="{$Think.session.people_id}">
                    <div class="row">
                        <label class="col-xs-3" style="padding-right: 0px">图文位置</label>
                        <div class="col-xs-4 lesspadding" style="margin-top: -5px;">
                            <select id="position" name="position" class="selectpicker show-tick form-control"  data-live-search="false">
                                {$html}
                            </select>
                        </div>
                        <div class="col-xs-5 text-right"><strong><span class="font_blue">单价：</span><i id="show_price">{$price0['B']}</i>元</strong></div>
                        <input type="hidden" name="price" id="price" value="{$price0['B']}">
                        <input type="hidden" name="exec_price" id="exec_price" value="{$price0['C']}">
                        <input type="hidden" name="deal_price" id="deal_price" value="{$price0['D']}">
                    </div>
                    <br>
                    <div class="row">
                        <label class="col-xs-3" style="padding-right: 0px">贴片图片</label>
                        <div class="col-xs-9 lesspadding">
                            <input type="file" name="pic" class="form-control">
                        </div>
                    </div>
                    <br>
                    <div class="row">
                        <label class="col-xs-3" style="padding-right: 0px">投放参考图文</label>
                        <div class="col-xs-9 lesspadding">
                            <input type="url" maxlength="255" class="form-control" name="url" placeholder="http://">
                        </div>
                    </div>
                    <br>
                    <div class="row">
                        <label class="col-xs-3" style="padding-right: 0px">联系人</label>
                        <div class="col-xs-9 lesspadding">
                            <input type="text" maxlength="10" class="form-control" name="contact" placeholder="" required="required" aria-required="true">
                        </div>
                    </div>
                    <br>
                    <div class="row">
                        <label class="col-xs-3" style="padding-right: 0px">联系电话</label>
                        <div class="col-xs-9 lesspadding">
                            <input type="tel" maxlength="13" class="form-control" name="phone" placeholder="" required="required" aria-required="true">
                        </div>
                    </div>
                    <br>
                    <div class="row ">
                        <label for="datepicker" class="col-xs-3">投放日期</label>
                        <div class="input-group date form_date col-xs-9 lesspadding" data-date="" data-date-format="yyyy-mm-dd" data-link-field="datepicker" data-link-format="yyyy-mm-dd" style="padding-right: 15px;">
                            <input class="form-control" size="16" type="text" value="" readonly required="required" aria-required="true">
                            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
                        </div>
                        <input type="hidden" id="datepicker" name="datepicker" value="" /><br/>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="add()">添加</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<script>
    $('.form_date').datetimepicker({
        language:  'zh-CN',
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        minView: 2,
        forceParse: 0
    });
    $('#position').change(function(){
        var price = $("#position option:selected").attr("price");
        $('#show_price').html(price);
        $('#price').val(price);
        $('#exec_price').val($("#position option:selected").attr("exec_price"));
        $('#deal_price').val($("#position option:selected").attr("deal_price"));
    });
    function add() {

        $('#uploadForm').ajaxSubmit(function(res){
            if(res.code == 1) {
                var text = $("#position option:selected").text();

                $('.list-group').append('<li class=\"list-group-item\">' + text + '<span class=\"pull-right\">' + $('#datepicker').val() + '</span></li>');
                $('#myModal').modal('hide');
            } else {
                alert(res.msg);
            }
        });
    }
    function checkPeople() {
        if('{$Think.session.people_id}' == '') {
            window.location = "{:url('login/index')}";
        }
    }
</script>
</body>
</html>